<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('基本表单')"/>
</head>
<body class="gray-bg">
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript">
    var answer = "";
    var bankId = "";
    var score = 0;
    var questionId = "";
    var questionIdbyduo = "";
    var questionIdbypdt = "";
    function change() {
        bankId = $("#item1").find("option:selected").val();
        var question = "";
        var optionalA = "";
        var optionalB = "";
        var optionalC = "";
        var optionalD = "";
        var optionalF = "";
        var questionbt = "";
        var paperTitle = "";
        var questionbyduo = "";
        var optionalAbyduo = "";
        var optionalBbyduo = "";
        var optionalCbyduo = "";
        var optionalDbyduo = "";
        var optionalFbyduo = "";
        var questionbtbyduo = "";
        var paperTitlebyduo = "";
        var questionbypdt = "";
        var optionalFbypdt = "";
        var questionbtbypdt = "";
        var paperTitlebypdt = "";
        var submitdiv = "";
        var quform = $("#quform");
        $("#quform").empty();
        var biaotidiv = "<div class='ibox-title' align='center'><h1>信息安全培训考试"
            + "<small>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;安徽海王国安医药有限公司</small>"
            + "</h1><span style='margin-left: 5%'>姓名(必填)：<input type='text' name='ximing'/></span>"
            + "<span style='margin-left: 5%'>考试得分：<input type='text' name='defen'/></span></div><hr>";
        quform.append(biaotidiv);
        // 单选题的ajax
        $.ajax({
            url: "/system/paper/listsques/" + bankId,
            type: 'POST',
            async: false,
            success: function (result) {
                paperTitle = result[0].optionalE;
                var dxdiv = "<div><label class='col-sm-12 control-box text-info'>" + paperTitle + "</label><br><hr></div>";
                quform.append(dxdiv);
                for (var i = 0; i < result.length; i++) {
                    question = result[i].question;
                    questionId = result[i].questionId;
                    optionalA = result[i].optionalA;
                    optionalB = result[i].optionalB;
                    optionalC = result[i].optionalC;
                    optionalD = result[i].optionalD;
                    optionalF = result[i].optionalF;
                    answer = result[i].answer;
                    questionbt = "<div id=" + questionId + " class='form-group'><label class='col-sm-12 control-box text-info'>" + optionalF + ":" + question + "<br/></label>"
                        + "<div class='col-sm-12 control-box text-info'><input type='radio' onchange='daan(this)' id=" + optionalA + " value='A' name=" + questionId + "\><font size='3.8'>A:</font>" + optionalA + "<br/>"
                        + "<input type='radio' onchange='daan(this)' id=" + optionalB + " value='B' name=" + questionId + "  \><font size='3.8'>B:</font>" + optionalB + "<br/>"
                        + "<input type='radio' onchange='daan(this)' id=" + optionalC + " value='C' name=" + questionId + "  \><font size='3.8'>C:</font>" + optionalC + "<br/>"
                        + "<input type='radio' onchange='daan(this)' id=" + optionalD + " value='D' name=" + questionId + "  \><font size='3.8'>D:</font>" + optionalD + "<br/>"
                        + "<input type='hidden' name='answer' value="+answer+" \>"
                        + "<input type='hidden' name='bankId' value="+bankId+"\>"
                        + "<input type='hidden' name='questionId' value=" + questionId + "\>"
                        + "<input type='hidden' name='xuanzeanswer'\>"
                        + "</div></div><hr>";
                    quform.append(questionbt);
                };
            },
        });
// 多选题ajax
        $.ajax({
            url: "/system/paper/listsquesbyduo/" + bankId,
            type: 'POST',
            async: false,
            success: function (result) {
                var answerbyduo = "";
                paperTitlebyduo = result[0].optionalE;
                var dxdivbyduo = "<div><label class='col-sm-12 control-box text-info'>" + paperTitlebyduo + "</label><br><hr></div>";
                quform.append(dxdivbyduo);
                for (var i = 0; i < result.length; i++) {
                    questionbyduo = result[i].question;
                    questionIdbyduo = result[i].questionId;
                    optionalAbyduo = result[i].optionalA;
                    optionalBbyduo = result[i].optionalB;
                    optionalCbyduo = result[i].optionalC;
                    optionalDbyduo = result[i].optionalD;
                    optionalFbyduo = result[i].optionalF;
                    answerbyduo = result[i].answer;
                    questionbtbyduo = "<div id=" + questionIdbyduo + " class='form-group'><label class='col-sm-12 control-box text-info'>" + optionalFbyduo + ":" + questionbyduo + "<br/></label>"
                        + "<div class='col-sm-12 control-box text-info'><input onchange='duodaan(this)' type='checkbox' id=" + optionalAbyduo + " value='A' name=" + questionIdbyduo + "\><font size='3.8'>A:</font>" + optionalAbyduo + "<br/>"
                        + "<input type='checkbox' onchange='duodaan(this)' id=" + optionalBbyduo + " value='B' name=" + questionIdbyduo + "  \><font size='3.8'>B:</font>" + optionalBbyduo + "<br/>"
                        + "<input type='checkbox' onchange='duodaan(this)' id=" + optionalCbyduo + " value='C' name=" + questionIdbyduo + "  \><font size='3.8'>C:</font>" + optionalCbyduo + "<br/>"
                        + "<input type='checkbox' onchange='duodaan(this)' id=" + optionalDbyduo + " value='D' name=" + questionIdbyduo + "  \><font size='3.8'>D:</font>" + optionalDbyduo + "<br/>"
                        + "<input type='hidden' name='answer' value="+answerbyduo+" \>"
                        + "<input type='hidden' name='bankId' value="+bankId+"\>"
                        + "<input type='hidden' name='questionId' value="+questionIdbyduo+" \>"
                        + "<input type='hidden' name='xuanzeanswer'>"
                        + "</div></div><hr>";
                    quform.append(questionbtbyduo);
                }
                ;
            },
        });
// 判断题ajax
        $.ajax({
            url: "/system/paper/listsquesbypdt/" + bankId,
            type: 'POST',
            async: false,
            success: function (result) {
                paperTitlebypdt = result[0].optionalE;
                var answerbypdt = "";
                var dxdivbypdt = "<div><label class='col-sm-12 control-box text-info'>" + paperTitlebypdt + "</label><br><hr></div>";
                quform.append(dxdivbypdt);
                for (var i = 0; i < result.length; i++) {
                    questionbypdt = result[i].question;
                    questionIdbypdt = result[i].questionId;
                    optionalFbypdt = result[i].optionalF;
                    answerbypdt = result[i].answer;
                    questionbtbypdt = "<div id=" + questionIdbypdt + " class='form-group'><label class='col-sm-12 control-box text-info'>" + optionalFbypdt + ":" + questionbypdt + "<br/></label>"
                        + "<div class='col-sm-12 control-box text-info'><input type='radio' value='A' onchange='pdtdaan(this)' name=" + questionIdbypdt + "\><font size='3.8'>A:</font>对<br/>"
                        + "<input type='radio' value='B' onchange='pdtdaan(this)' name=" + questionIdbypdt + "  \><font size='3.8'>B:</font>错<br/>"
                        + "<input type='hidden' name='answer' value="+answerbypdt+" \>"
                        + "<input type='hidden' name='bankId' value="+bankId+">"
                        + "<input type='hidden' name='questionId' value="+questionIdbypdt+">"
                        + "<input type='hidden' name='xuanzeanswer'>"
                        + "</div></div><hr>";
                    quform.append(questionbtbypdt);
                }
                ;
                submitdiv = "<div class='form-group'><div class='col-sm-4 col-sm-offset-2'>"
                    + "<button class='btn btn-primary' type='submit' onclick='tijiao()'>保存内容</button>"
                    + "<button class='btn btn-white' type='submit'>取消</button></div></div>";
                quform.append(submitdiv);
            },
        });
    };

    function daan(obj) {
        if ($(obj).prop("checked") == true) {
            var p = $(obj).val();
            var pbiaoqian = "<p class='col-sm-12 control-box text-info'>您选择的答案是：" + p + "</p>";
            $(obj).parent().parent().find("p").remove();
            $(obj).parent().parent().append(pbiaoqian);
            // if是给页面计算分数的
            // if ($(obj).parent().find("input:eq(4)").val()==$(obj).val()){
            //     score=score+4;
            //     $(obj).parent().find("input:eq(4)").remove();
            //     $(obj).parents().find("input:eq(1)").val(score);
            // }
            // $(obj).parent().find("input:eq(4)").val(p);
            // $(obj).parent().find("input:eq(6)").val(questionId);
            $(obj).parent().find("input:eq(7)").val(p);
        }
        ;
    };

    function duodaan(obj) {
        var str = "";
        $(obj).parent().parent().find("p").remove();
        for (var i = 0; i < $(obj).parent().find("input:checkbox:checked").length; i++) {
            str += $(obj).parent().find("input:checkbox:checked")[i].value;
        };
        var duop = "<p class='col-sm-12 control-box text-info'>您选择的答案是：" + str + "</p>";
        $(obj).parent().parent().append(duop);
        // if ($(obj).parent().find("input:eq(4)").val()==$(obj).val()){
        //     score=score+4;
        //     $(obj).parent().find("input:eq(4)").remove();
        //     $(obj).parents().find("input:eq(1)").val(score);
        // }
        // $(obj).parent().find("input:eq(4)").val(str);
        // $(obj).parent().find("input:eq(6)").val(questionIdbyduo);
        $(obj).parent().find("input:eq(7)").val(str);
    };

    function pdtdaan(obj) {
        if ($(obj).prop("checked") == true) {
            var p = $(obj).val();
            var pbiaoqian = "<p class='col-sm-12 control-box text-info'>您选择的答案是：" + p + "</p>";
            $(obj).parent().parent().find("p").remove();
            $(obj).parent().parent().append(pbiaoqian);
            // $(obj).parent().find("input:eq(2)").val(p);
            // $(obj).parent().find("input:eq(4)").val(questionIdbypdt);
            $(obj).parent().find("input:eq(5)").val(p);
        }
        ;
    };

    function tijiao() {
        $.ajax({
            url:"/system/examination/addksexamination",
            type:'POST',
            data: $("#divform form").serialize(),
            success:function (result) {
                alert(result);
                console.log(result);
                alert("添加成功")
            }
        });
        return false;
    };
</script>


<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">

                <div class="ibox-content" id="divform">
                    <form method="post" id="quform" class="form-horizontal">
                        <div class="ibox-title" align="center">
                            <h1>信息安全培训考试
                                <small>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;安徽海王国安医药有限公司</small>
                            </h1>
                            <span style="margin-left: 5%">姓名(必填)：<input type="text" name="ximing"/></span>
                            <span style="margin-left: 5%">试卷选择：
                        <select class="select_class" id="item1" onchange="change()">
                            <option>--- 请选择 ---</option>
                            <option th:each="ksBanks : ${ksBanks}" th:value="${ksBanks.bankId}" name="bankId"><span
                                    th:text="${ksBanks.bankName}" name="bankId"
                                    th:value="${ksBanks.bankId}"></span></option>
                        </select></span>
                        </div>
                        <hr/>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
</body>
</html>
